<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>商品详情</title>
		<link rel="stylesheet" href="css/public.css" />
		<link rel="stylesheet" href="css/goodinfo.css" />
		<script src="js/ajax.js"></script>
	</head>
	<body>
		<div class="header">
			<div class="h_link_bg">
				<div class="h_link">
					<div class="h_logo"><img src="img/register.png" alt="" /></div>
					<div class="h_content">
						<ul>
							<li><a href="login.html">登录</a></li>
							<li><a href="register.html">注册</a></li>
							<li><a href="">|</a></li>
							<li class="myCart">
								<a href="shopping cart.html">购物</a>
								<div class="car">

									<p>你的购物车暂时没有商品...</p>
									<p>快去抢购良仓商品吧!</p>

								</div>
							</li>
							<li><a href="">|</a></li>
							<li class="message">
								<a href="">消息</a>
								<div>
									<ul>
										<li><a href="#">动态<span>0</span></a></li>
										<li><a href="#">评论<span>0</span></a></li>
										<li><a href="#">私信<span>0</span></a></li>
										<li><a href="#">喜欢<span>0</span></a></li>
										<li><a href="#">粉丝<span>0</span></a></li>
										<li><a href="#">通知<span>0</span></a></li>
									</ul>
								</div>

							</li>
							<li><a href="">|</a></li>
							<li><a href="">添加良品</a></li>
							<li><a href="">资质证照|协议规则</a></li>
						</ul>
					</div>
				</div>
			</div>
			<div class="h_nav">
				<ul>
					<li><a href="index.html">首页</a></li>
					<li class="good_type">
						<a href="#">商店</a>
						<div>
							<div class="type_list">
								<ul>
									<!--<li>
										<a href="#">
										    <img src="img/nav_icon3.png" alt="" />
										    <p>玩乐</p>
										</a>
									</li>-->
								</ul>
							</div>
							<div class="type_img">
								<div><img src="img/nav_banner.jpg" alt="" /></div>
								<p>新视界:2024年12月刊</p>
							</div>
							<div class="type_link">
								<p>
									<a href="#">查看所有品牌</a>
									<a href="#">最新到货</a>
								</p>
							</div>
						</div>
					</li>
					<li class="magazine">
						<a href="magazine.html">杂志</a>
						<div>
							<ul>
								<li><a href="">趣物</a></li>
								<li><a href="">数码</a></li>
								<li><a href="">汽车</a></li>
								<li><a href="">文化</a></li>
								<li><a href="">时尚</a></li>
								<li><a href="">美食</a></li>
								<li><a href="">建筑</a></li>
								<li><a href="">空间</a></li>
								<li><a href="">圈子</a></li>
								<li><a href="">清洁</a></li>
								<li><a href="">活动</a></li>
								<li><a href="">视频</a></li>
							</ul>
						</div>
					</li>
					<li><a href="#">分享</a></li>
					<li><a href="#">达人</a></li>
					<li><a href="#">有偿资讯</a></li>
					<div class="search">
						<input type="text" name="keyWorks" id="searchInput" placeholder="请输入搜索关键词" />
						<div id="searchBtn"></div>
					</div>
				</ul>
			</div>
		</div>



		<div class="good_content">
			<!--<div class="goods_left"><img src="https://imgs-qn.iliangcang.com/ware/goods/big/2/245/245152.jpg" /></div>
			<div class="goods_right">
				<p>
				<div class="good_icon"></div>4090</p>
				<div class="goods_id">
					<p>Ostrich Pillow</p>
				</div>
				<div class="goods_name">
					<p>轻型款鸵鸟枕【宝蓝灰】</p>
				</div>
				<div class="goods_price">
					<p>价格：<span>¥299元</span></p>
				</div>
				<div class="goods_img">
					<p><img src="img/plane.png" /><span>免运费</span><img src="img/grant.png" /><span>正品授权</span></p>
				</div>
				<div class="goods_color">
					<p>颜色:
					<div class="boder"><img src="https://imgs-qn.iliangcang.com/ware/goods/big/2/245/245152.jpg"
							style="height: 40px;width: 40px;" /><span>宝蓝</span></div>
					</p>
				</div>
				<div class="goods_count">
					<p>数量:</p>
					<img src="img/minus.png" style="height: 15px;width: 15px;" />
					<div class="one">1</div>
					<img src="img/plus.png" style="height: 15px;width: 15px;" />



				</div>
				<div class="shuoming">
					<p>已售罄，即将到货</p>
				</div>
				<div class="goods_btn"><button><img src="img/car.png" />加入购物车</button><button><img
							src="img/fenx.png" />分享</button></div>
			</div>
			-->
		</div>







		<div class=" footer">
			<div class="logo">
				<div class="logo_title">
					<div class="logo_finger"></div>
					<div>
						<p>良仓商品/OUR SHOP</p>
					</div>
				</div>
				<div class="logo_list">
					<ul>
						<li>
							<div class="icon1"></div>
							<div>
								<p>全球精品</p>
								<p>Global Selections</p>
							</div>
						</li>
						<li>
							<div class="icon2"></div>
							<div>
								<p>正品保证</p>
								<p>Authenticity Guaranteed</p>
							</div>
						</li>
						<li>
							<div class="icon3"></div>
							<div>
								<p>全场包邮</p>
								<p>Free Delivery</p>
							</div>
						</li>
						<li>
							<div class="icon4"></div>
							<div>
								<p>客服邮箱</p>
								<p>kefu@iliangcang.com</p>
							</div>
						</li>
					</ul>
				</div>
			</div>
			<div class="footer_bg">
				<div class="footer_info">
					<div class="info">
						<div>
							<div class="icon_phone"></div>
							<div>
								<p>iPhone Android</p>
								<p>客户端下载</p>
							</div>
						</div>
						<div>
							<ul>
								<li><img src="img/dou.png" /></li>
								<li><img src="img/wb.png" /></li>
								<li><img src="img/qq.png" /></li>
							</ul>
						</div>
					</div>
					<div class="address">
						<p><a href="#">关于良仓</a>|<a href="#">服务协议</a>|<a href="#">隐私保护协议</a>|<a href="#">使用指南</a>|<a
								href="#">联系我们</a>|
							<a href="#">加入我们</a>|<a href="#">友情链接</a>|<a href="#">私信良仓</a>
						</p>
						<p>©2013-2019 北京良仓文化传播有限公司版权所有</p>
						<p>公司名称：北京良仓文化传播有限公司 客服邮箱：kefu@iliangcang.com</p>
						<p>公司地址：北京朝阳区百子湾路32号6号楼1层60号.</p>
						<p>社会信用统一代码：91110105059231575L 食品许可证：JY11105160159557 </p>
						<p>图书证名称：中华人民共和国出版物经营许可证 图书证编号：新出发京零 字第 朝 150051 号</p>
						<p>京ICP备13010677号-1 京公网安备11010502025627</p>
					</div>
				</div>
			</div>

			<div class="side">
				<div class="code">
					<div class="qrCode"><img src="img/orcode10.png" alt="" /></div>
					<div><button class="close"></button></div>
				</div>
				<div class="arrow"></div>

				<div class="concart">联系客服</div>
			</div>


		</div>
	</body>
	<script src="js/public.js"></script>
	<script>
		window.onload = function() {
			getGoodNavType((data) => {
				let typeList = document.querySelector(".type_list>ul");
				let goodListData = data.data;
				let text = '';
				goodListData.forEach((item, index) => {
					text += "<li><a href=''><img src ='" + item.cat_img + "'/><p>" + item.cat_name +
						"</p></a></li>"
				});
				typeList.innerHTML = text;
			});

			let BASE_URL = 'http://8.134.172.28:3008';
			let searchParams = new URLSearchParams(window.location.search);
			let goods_id = searchParams.get('goods_id');


			(function() {
				ajax({
					url: BASE_URL + "/api_goods?goods_id=" + goods_id,
					method: "get",
					type: 'JSON',
					callback: function(data) {
						console.log(data.data);
						let goods = data.data;
						let goodcontent = document.querySelector(".good_content");
						let text = '';

						let item = goods.find(g => g.goods_id == goods_id);
						if (item) {
							text += "<div class='goods_left'>" +
								"<img src='" + item.goods_thumb + "'/>" +
								"</div>" +
								"<div class='goods_right'>" +
								"<p>" +
								"<div class='good_icon'>" +
								"</div>" +
								'4096' +
								"</p>" +
								"<div class='goods_id'>" +
								"<p>" + item.brand_name + "</p>" +
								"</div>" +
								"<div class='goods_name'>" +
								"<p>" + item.goods_name + "</p>" +
								"</div>" +
								"<div class='goods_price'>" +
								"<p>价格" + "<span>" + "¥" + item.price + "元" + "</span>" + "</p>" +
								"</div>" +
								"<div class='goods_img'>" +
								"<p>" + "<img src='img/plane.png' />" + "<span>免运费</span>" +
								"<img src='img/grant.png' />" +
								"<span>正品授权</span>" +
								"</p>" + "</div>" +
								"<div class='goods_color'>" +
								"<p>颜色:" + "<div class='boder'>" +
								"<img src='" + item.goods_thumb +
								"' style='height: 40px;width: 40px;' />" +
								"<span>宝蓝</span>" +
								"</div>" +
								"</p>" + "</div>" +
								"<div class='goods_count'>" +
								"<p>数量:</p>" +
								"<img src='img/minus.png' style='height: 15px;width: 15px;' />" +
								"<div class='one'>" + item.goods_number + "</div>" +
								"<img src='img/plus.png' style='height: 15px;width: 15px;' />" +
								"</div>" +
								"<div class='shuoming'>" + "</div>" +
								"<div class='goods_btn'>" +
								"<button class='add-to-cart'>" + "<img src='img/car.png' />" + '加入购物车' +
								"</button>" +
								"<button>" +
								"<img src='img/fenx.png' />" + '分享' + "</button>" + "</div>" +
								"</div>";
						}
						goodcontent.innerHTML = text;

						let addtocart = document.querySelector('.add-to-cart');
						addtocart.addEventListener('click', () => {
							// 获取商品详细信息
							const goodsInfo = {
								id: item.goods_id,
								name: item.goods_name,
								price: item.price,
								image: item.goods_thumb,
								quantity: 1 // 默认数量为1
							};

							// 获取现有购物车数据
							let cart = JSON.parse(localStorage.getItem('cart') || '[]');

							// 检查商品是否已存在
							const existingItem = cart.find(i => i.id === goodsInfo.id);
							if (existingItem) {
								existingItem.quantity += 1; // 数量+1
							} else {
								cart.push(goodsInfo);
							}

							// 保存到本地存储
							localStorage.setItem('cart', JSON.stringify(cart));

							// 跳转到购物车页面
							window.location.href = 'shopping cart.html';
						});
					}
				})
			})();


		}
	</script>
	<script type="text/javascript" src="js/searchgood.js"></script>
</html>